<div id="doc-body-footer" class="clearfix">
    <div class="pull-left">
        <div id="tuliTrigger" class="btn-sm bottom-hover-trigger" data-toggle="tooltip" data-placement="top" data-container="#doc-body" data-html="true" title='<span class="tuli-tag-status tag-status-not-in">Not admitted</span><span class="tuli-tag-status tag-status-in">Has been admitted</span><span class="tuli-tag-status tag-status-need-out">Late Checkout</span><span class="tuli-tag-status tag-status-out">Fill or check out</span>'>
            <span class="iconfont icon-question-sign"></span>&nbsp;Legend
        </div>
    </div>
    <div class="pull-left">
        <div id="viewstyleTrigger" class="bottom-hover-trigger" data-toggle="modal" data-target="#viewstyleModal"><span class="iconfont icon-thlist"></span>&nbsp;House style</div>
    </div>
    <div class="pull-left select-plug-in-container" >
        <a class="bottom-hover-trigger"><span class="iconfont icon-download"></span>&nbsp;Print</a>
        <div class="download-select">
            <div class="col-xs-6 select-plug-in"><a href="javascript:void(0);" data-toggle="modal" data-target="#printSettingModal">Print Settings</a></div>
            <div class="col-xs-6 select-plug-in"><a target="_blank" href="http://ob2p0ov9p.bkt.clouddn.com/meizhu_print.rar">Print help</a></div>
            <div class="select-down"></div>
        </div>
    </div>    
    <div class="pull-left select-plug-in-container" >
        <a class="bottom-hover-trigger"><span class="iconfont icon-download"></span>&nbsp;Update Plugins</a>
        <div class="download-select">
        	<div class="col-xs-6 select-plug-in"><a target="_blank" href="/Home/PublicPage/rfinstallT57.html">USB-M1RF</a></div>
            <div class="col-xs-6 select-plug-in"><a target="_blank" href="/Home/PublicPage/rfinstallM1.html">USB-QRM1</a></div>
            <div class="select-down"></div>
        </div>
    </div>
    <div class="pull-left">
        <div class="bottom-hover-trigger rfReadInfofirst" data-toggle="modal" data-target="#rfReadInfoModal" style="color: #ffffff;"><span class="icon-xiaoxi iconfont"></span>&nbsp;Card/Logout</div>
    </div>
    <div class="pull-right">
        <div id="clientServiceTrigger"  class="btn-sm bottom-hover-trigger" data-toggle="tooltip" data-placement="top" data-container="#doc-body" data-html="true" title='<div style="width:210px;text-align:left;padding: 4px 0px;">Contact us, please call customer service phone:<div style="color:#8bc34a;font-size: 20px;margin-top:4px;" class="typo-title">400-8618286<span class="type-caption" style="font-size:12px;color:#fff;">&nbsp;(9:00-21:00)</span></div></div>'>
            <span class="iconfont icon-landline"></span>
        </div>
    </div>
    <div class="pull-right" data-toggle="tooltip" data-placement="top" data-container="#doc-body" data-html="true" title="Sound Setting" >
        <div id="soundToggleTrigger" data-type="{$voicestatus}" class="bottom-hover-trigger" data-toggle="modal" data-target="#soundToggleModal"><span class="iconfont icon-sound "></span></div>
    </div>
    <div class="pull-right" data-toggle="tooltip" data-placement="top" data-container="#doc-body" data-html="true" title="Memo" >
        <div id="blackBoard"  data-type="" class="bottom-hover-trigger" data-toggle="modal" data-target="#remindToggleModal"><div class="board-little-red hidden"></div><span class="iconfont icon-memo">&nbsp;</span></div>
    </div>
    <div class="pull-right" data-toggle="tooltip" data-placement="top" data-container="#doc-body" data-html="true" title="Remind" >
        <div id="warnReception" data-type="" class="bottom-hover-trigger" data-toggle="modal" data-target="#warnToggleModal"><span class="iconfont icon-warn">&nbsp;</span></div>
    </div>
    <div id="pushCenter" class="pushCenter" >
        <if condition='checkAccess($adminAuthority, "Home/ReportPage/accountview")'>
            <div class="project-content">
                <div class="push_left"></div>
                <div class="push_right "><span class="word_push">Accounting</span></div>
                <div style="clear: both;"></div>
            </div>
        </if>        
        <div class="push-content">
            <div class="push_left"></div>
            <div class="push_right"><span class="word_push">Message center</span><span class="messages"></span></div>
            <div style="clear: both;"></div>
        </div>
    </div>   
</div>
<div class="eight-guidance-box clearfix hidden">
    <div class="eight-guidance-next">
        <div class="pull-left">
            <div class="btn-sm bottom-hover-trigger">
                <span class="iconfont icon-question-sign"></span>&nbsp;Legend
            </div>
        </div>
        <div class="pull-left">
            <div class="bottom-hover-trigger" ><span class="iconfont icon-thlist"></span>&nbsp;House style</div>
        </div>
        <div class="pull-left" >
            <a class="bottom-hover-trigger"><span class="iconfont icon-download"></span>&nbsp;Print</a>
        </div>    
        <div class="pull-left " >
            <a class="bottom-hover-trigger"><span class="iconfont icon-download"></span>&nbsp;Update Plugins</a>
        </div>
        <div class="pull-left">
            <div class="bottom-hover-trigger"  style="color: #ffffff;"><span class="icon-xiaoxi iconfont"></span>&nbsp;Card/Logout</div>
        </div>
        <div class="pull-right">
            <div  class="btn-sm bottom-hover-trigger" >
                <span class="iconfont icon-landline"></span>
            </div>
        </div>
        <div class="pull-right">
            <div  class="bottom-hover-trigger" ><span class="iconfont icon-sound" style="background-position:center -1px; "></span></div>
        </div>
        <div class="pull-right">
            <div class="bottom-hover-trigger"><div class="board-little-red hidden"></div><span class="iconfont icon-memo">&nbsp;</span></div>
        </div>
        <div class="pull-right">
            <div  class="bottom-hover-trigger" ><span class="iconfont icon-warn">&nbsp;</span></div>
        </div>        
    </div>
</div> 
<!--js要用到的模板-->
<script type="text/html" id="templatePushMessage">
    <div class="li_list order-item" data-parent="" data-value="" data-room="">
        <div class="list_left list-night hidden">
            <div class="push_height">Hotel:<span class="hotel_name"></span></div>
            <div class="push_height">Room:<span class="room_name"></span></div>
            <div class="push_height"><span class="room-enter-label hidden">C/I time:</span><span class="room-out-label hidden">C/O time:</span><span class="enter_time"></span>&nbsp;&nbsp;live<span class="push_night"></span>nights</div>
        </div>
        <div class="list_left list-hour hidden">
            <div class="push_height">Hotel:<span class="hotel_name"></span></div>
            <div class="push_height">Room(Hour room):<span class="room_name"></span></div>
            <div class="push_height"><span class="room-enter-label hidden">C/I time:</span><span class="room-out-label hidden">C/O time:</span><span class="enter_time"></span>&nbsp;&nbsp;live<span class="push_hour"></span> hours</div>
        </div>
        <div class="list_right">Get it</div>
    </div>
</script>
<script type="text/html" id="templatePushWarn">
    <div class="li_list">
        <div class="list_left">
            <div class="push_height">Hotel:<span class="hotel_name"></span></div>
            <div class="push_height">Reminder time:<span class="warn_time"></span></div>
            <div class="push_height">Reminder contents:<span class="Warn_content"></span></div>
        </div>
        <div class="list_right">Get it</div>
    </div>
</script>
<script type="text/html" id="templatePushCheck">
    <div class="li_list">
        <div class="list_left">
            <div class="push_height">Hotel:<span class="hotel_name"></span></div>
            <div class="push_height">Room:<span class="check_room"></span></div>
            <div class="push_height">Goods consumption :<span class="check_content"></span>&nbsp;&nbsp;Remark:<span class="check_remark"></span></div>
        </div>
        <div class="list_right">Get it</div>
    </div>      
</script>
<div class="modal fade" data-backdrop="static" id="viewstyleModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">House style</div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-xs-6">
                        <a class="viewstylePreview1  viewstylePreview lazyload-background [view-style-1]" style="display: block; background-image: url('/Public/dist/Home/BookPage/image/viewstyle_1.jpg?rev=1');" data-original="/Public/dist/Home/BookPage/image/viewstyle_1.jpg?rev=1" href="/Home/BookPage/index?hotel={$currentHotel}&viewstyle=1">
                            <div class="viewstylePreviewHover absolute-shade">
                                <span class="glyphicon glyphicon-ok"></span>
                            </div>
                        </a>
                        <h4 class="text-center vertical-margin typo-text-black-light">Horizontal screen</h4>
                    </div>
                    <div class="col-xs-6">
                        <a class="viewstylePreview2 viewstylePreview lazyload-background [view-style-2]" style="display: block; background-image: url('/Public/dist/Home/BookPage/image/viewstyle_2.jpg?rev=1');" data-original="/Public/dist/Home/BookPage/image/viewstyle_2.jpg?rev=1" href="/Home/BookPage/index?hotel={$currentHotel}&viewstyle=2">
                            <div class="viewstylePreviewHover absolute-shade">
                                <span class="glyphicon glyphicon-ok"></span>
                            </div>
                        </a>
                        <h4 class="text-center vertical-margin typo-text-black-light">Vertical screen</h4>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" data-backdrop="static" id="soundToggleModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Voice notification setting</div>
            </div>
            <div class="modal-body" style="padding: 20px 16px;">
                <form class="form-horizontal form-sm">
                    <div class="form-group">
                        <label style="text-align: left;" class="col-xs-3 control-label">State of the sound:</label>
                        <div class="col-xs-8" style="margin-top: 5px;">
                            <div class="col-xs-2">
                                <label class="switch ulite-js-switch ulite-js-ripple-effect ulite-js-ripple-effect--ignore-events is-upgraded" id="soundSwitch" data-type="{$voicestatus}" data-upgraded=",MaterialSwitch,MaterialRipple">
                                    <span class="switch-label switch-label-sm"></span>
                                <div class="switch-track"></div><div class="switch-thumb"><span class="switch-focus-helper"></span></div><span class="switch-ripple-container ulite-js-ripple-effect ulite-ripple--center" data-upgraded=",MaterialRipple"><span class="ripple is-animating" style="width: 137.765px; height: 137.765px; transform: translate(-50%, -50%) translate(24px, 24px);"></span></span></label>
                            </div>
                            <div class="col-xs-10">
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                    <embed class="hidden" id="chatAudioIE" type="audio/midi" src="/Public/uclbrt/audio/speak_en.mp3" width="0"  height="0" autostart=false  loop=false></embed>
                    <audio class="hidden" id="chatAudio">
                        <source src="/Public/uclbrt/audio/speak_en.ogg" type="audio/ogg">
                        <source src="/Public/uclbrt/audio/speak_en.mp3" type="audio/mpeg">
                        <source src="/Public/uclbrt/audio/speak_en.wav" type="audio/wav">
                    </audio>
                    <embed class="hidden" id="warnAudioIE" type="audio/midi" src="/Public/uclbrt/audio/warn.mp3" width="0"  height="0" autostart=false  loop=false></embed>
                    <audio class="hidden" id="warnAudio">
                        <source src="/Public/uclbrt/audio/warn.ogg" type="audio/ogg">
                        <source src="/Public/uclbrt/audio/warn.mp3" type="audio/mpeg">
                        <source src="/Public/uclbrt/audio/warn.wav" type="audio/wav">
                    </audio>   
                    <embed class="hidden" id="checkAudioIE" type="audio/midi" src="/Public/uclbrt/audio/warn.mp3" width="0"  height="0" autostart=false  loop=false></embed>
                    <audio class="hidden" id="checkAudio">
                        <source src="/Public/uclbrt/audio/warn.ogg" type="audio/ogg">
                        <source src="/Public/uclbrt/audio/warn.mp3" type="audio/mpeg">
                        <source src="/Public/uclbrt/audio/warn.wav" type="audio/wav">
                    </audio>           
                    <div class="form-group">
                        <label style="text-align: left;" class="col-xs-12 control-label">The computer needs to turn on the speaker</label>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" data-backdrop="static" id="printSettingModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Print Settings</div>
            </div>
            <div class="modal-body">
                <div class="printStyle">
                    <label class="radio ulite-js-radio ulite-js-ripple-effect" style="margin-left: 80px;">
                        <input id="requestPrintOrder" type="radio" class="radio-btn" name="requestAccountType" value="0" checked/>
                        <span class="radio-label">Order</span>
                    </label>
                    <label class="radio ulite-js-radio ulite-js-ripple-effect">
                        <input id="requestPrintCard" type="radio" class="radio-btn" name="requestAccountType" value="1" />
                        <span class="radio-label">QRRoom card</span>
                    </label>
                </div>
                <form class="form-horizontal form-sm" id="container-order">
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Printer name:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printName" maxlength="30" autocomplete="off" placeholder="The default printer is called by default" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group printUnite">
                        <label class="col-xs-3 control-label">Printer couplets :</label>
                        <div class="col-xs-9"> 
                            <label style="padding-top:6px ;margin-right: 16px;" class="radio ulite-js-radio ulite-js-ripple-effect">
                                <input id="requestPrintUnite" type="radio" class="radio-btn" name="requestUnite" value="1" />
                                <span class="radio-label">One couplets </span>
                            </label>
                            <label style="padding-top:6px ;" class="radio ulite-js-radio ulite-js-ripple-effect">
                                <input id="requestPrintTwoUnite" type="radio" class="radio-btn" name="requestUnite" value="2" />
                                <span class="radio-label">Two couplets </span>
                            </label>
                        </div>
                    </div>
                    <div class="form-group printPaper">
                        <label class="col-xs-3 control-label">Printing paper:</label>
                        <div class="col-xs-9"> 
                            <label style="padding-top:6px ;margin-right: 13px;" class="radio ulite-js-radio ulite-js-ripple-effect">
                                <input id="requestPrintA4" type="radio" class="radio-btn" name="requestPaper" value="0" />
                                <span class="radio-label">A4 paper</span>
                            </label>
                            <label style="padding-top:6px ;" class="radio ulite-js-radio ulite-js-ripple-effect">
                                <input id="requestPrintX58" type="radio" class="radio-btn" name="requestPaper" value="1" />
                                <span class="radio-label">58mm paper</span>
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label"> Tips1:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printHint3" maxlength="30" autocomplete="off" placeholder="Print the tip at the end of the paper" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label"> Tips2:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printHint4" maxlength="30" autocomplete="off" placeholder="Print the tip at the end of the paper" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-xs-4">
                            <label class="col-xs-9 control-label" style="padding-right: 6px;">Print phone No.:</label>
                            <div class="col-xs-3" style="padding-left: 12px;"> 
                                <label class="switch ulite-js-switch ulite-js-ripple-effect" id="isPrintMoblie">
                                    <input type="checkbox" class="switch-input" checked/>
                                    <span class="switch-label switch-label-sm"></span>
                                </label>                       
                            </div>
                        </div>
                        <div class="col-xs-4">
                            <label class="col-xs-9 control-label">Print IDcard:</label>
                            <div class="col-xs-3"> 
                                <label class="switch ulite-js-switch ulite-js-ripple-effect" id="isPrintIDCard">
                                    <input type="checkbox" class="switch-input" checked/>
                                    <span class="switch-label switch-label-sm"></span>
                                </label>                      
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-xs-4">
                            <label class="col-xs-9 control-label" style="padding-right: 6px;">Previews:</label>
                            <div class="col-xs-3" style="padding-left: 12px;"> 
                                <label class="switch ulite-js-switch ulite-js-ripple-effect" id="isPreviews">
                                    <input type="checkbox" class="switch-input" checked/>
                                    <span class="switch-label switch-label-sm"></span>
                                </label>                      
                            </div>
                        </div>
                        <div class="col-xs-4 hidden">
                            <label class="col-xs-9 control-label" >C/Oh是否PromptPrint:</label>
                            <div class="col-xs-3">
                                <label class="switch ulite-js-switch ulite-js-ripple-effect" id="isPrintTip">
                                    <input type="checkbox" class="switch-input" checked/>
                                    <span class="switch-label switch-label-sm"></span>
                                </label>                  
                            </div>
                        </div>
                    </div>
                </form>
                <form class="form-horizontal form-sm hidden" id="container-card">
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Printer name:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printNameCard" maxlength="30" autocomplete="off" placeholder="The default printer is called by default" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label"> Tips1:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printHint1" maxlength="30" autocomplete="off" placeholder="Print the tip at the end of the paper" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label"> Tips2:</label>
                        <div class="col-xs-5">
                            <input type="text" class="form-control" id="printHint2" maxlength="30" autocomplete="off" placeholder="Print the tip at the end of the paper" value="" />
                        </div>
                        <div class="col-xs-4">
                            <div class="help-block"></div>
                        </div>
                    </div>
                </form>                
                
            </div>
            <div class="modal-footer">
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="col-xs-10 col-xs-offset-2">
                            <div class="help-block inline-help-block inline-help-block-right"></div>
                            <button type="button" class="btn-sm btn-primary btn-raised" data-value="" id="submitPrintHintOrder">OK</button>
                            <button type="button" class="btn-sm btn-primary btn-raised hidden" data-value="" id="submitPrintHintCard">OK</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" data-backdrop="static" id="rfReadInfoModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Read RF card data</div>
            </div>
            <div class="modal-body">			                
			    <script type="text/javascript">
			    	var isClientAvailable = {$isClientAvailable?'true':'false'};
			    	var userId = {$userId};			    	 
			    </script>          
                <form class="form-horizontal form-sm">   
                    <div class="form-group">
                        <label class="col-xs-3 control-label"><span class="text-accent">*</span>Type:</label>
                        <div id="cardTypeRadio" class="col-xs-7" style="font-size: 12px;">
                            <label class="radio-inline">
                                <input type="radio" name="requestCardType" value="2" id="requestMeizhuCardTypeV9" checked>USB-M1RF
                            </label>
                            <label class="radio-inline">
                                <input type="radio" name="requestCardType" value="3">USB-QRM1
                            </label>
                            <label class="radio-inline">
                                <input type="radio" name="requestCardType" value="4" id="requestMeizhuCardTypeBth">QRB-M1RF
                            </label>
                        </div>
                    </div>
                    <div class="form-group hidden" id="issueMacGroup">
                        <label class="col-xs-3 control-label" for="requestIssueMac"><span class="text-accent">*</span>Select Device:</label>
                        <div class="col-xs-7">
                            <select class="form-control" id="requestIssueMac">
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Room number:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-roomName" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>               
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Room type:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-roomStyle" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Contact person:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-userName" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-3 control-label">The contract number:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-userMobile" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>                    
                    <div class="form-group">
                        <label class="col-xs-3 control-label">ID card:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-userIdentity" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>                    
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Batch number:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-batchNo" autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>               
                    <div class="form-group">
                        <label class="col-xs-3 control-label">Card issuance time:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-writeTime"  autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>                    
                    <div class="form-group">
                        <label class="col-xs-3 control-label">End Time:</label>
                        <div class="col-xs-7">
                            <input type="text" readonly="readonly" disabled="disabled" class="form-control" id="RF-availableTime"  autocomplete="off" placeholder="" value="" />
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="col-xs-10 col-xs-offset-2">
                            <div class="help-block inline-help-block inline-help-block-right"></div>
                            <div class="btn-sm btn-primary btn-raised" data-value="" id="submitRfcardCancel">Cancel</div>
                            <div class="btn-sm btn-primary btn-raised" data-value="" id="submitRfcardRead">Reading card</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--CancelRF卡-->
<div class="modal fade in" id="cancelledModal">
    <div class="modal-dialog modal-confirm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn close" data-dismiss="modal">
                    <span>×</span>
                </button>
                <h4 class="modal-title">Prompt</h4>
            </div>
            <div class="modal-body">Are you sure to cancel the RF card?</div>
            <div class="modal-footer">
                <button type="button" class="btn-primary ulite-js-ripple-effect ulite-js-btn btn-raised" id="submitCancelledModal">OK</button>
            </div>
        </div>
    </div>
</div>
<!--Memo-->
<div class="modal fade" data-backdrop="static" id="remindToggleModal">
    <div class="modal-dialog sm-width" style="width: 540px; top: 10%">
        <div class="modal-content" style="width: 540px; min-height: 380px;">
            <div class="modal-header blackboard-mini" style="border: 0;">
                <button style="margin-right: 10px;" type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title" style="padding-left:22px ;">Memo</div>
            </div>
            <div class="modal-body">
                <textarea id="textareaBlack" maxlength="500" contenteditable="true" style="width: 464px; min-height: 320px; margin: 20px 22px 0px 22px;font-size:14px;padding: 8px 8px; border: 1px solid #e5e5e5; outline: none; overflow:auto; " placeholder="Come on Mark and write something. &#13;&#10;For example: 304 tenant XXX, send XXX at the front desk"></textarea>
            </div>
            <div class="modal-footer" style="border: 0;margin-bottom: 6px;">
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="col-xs-10 col-xs-offset-2">
                            <div class="help-block inline-help-block inline-help-block-right" style="height: 30px;line-height: 30px;"></div>
                            <div class="btn-sm btn-primary btn-raised" data-value="" style="width: 46px;padding: 0;margin-right: 10px;" id="requestBlack">Save</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--Reminder contents-->
<div class="modal fade" data-backdrop="static" id="warnToggleModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header blackboard-mini" >
                <button  type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Remind</div>
            </div>
            <div class="modal-body">
                <div class="list-header">
                	<div class="list col-xs-3">Reminder time</div>
                    <div class="list col-xs-4">Reminder contents</div>
                    <div class="list col-xs-3">Last operator</div>
                    <div class="list col-xs-2">Operating</div>
                </div>      
                <div id="warnList"></div>
            </div>
            <div class="modal-footer">
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="col-xs-12">
                            <div class="add-warn">Add to remind</div>
                            <div class="message-more"><a style="color: #8bc34a;" href="/pushWarn.html">CheckMore</a></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="templateWarnList">
    <div class="list-item">
        <div class="list time col-xs-3"></div>
        <div class="list content col-xs-4"></div>
        <div class="list lastoperate col-xs-3"></div>
        <div class="list operate col-xs-2">
            <div class="list editor-warn col-xs-6">Modify</div>
            <div class="list remove-warn col-xs-6">Delete</div>
        </div>
    </div>
</script>        
<script type="text/html" id="templateWarnEmpty">
    <div class="content-panel-empty vertical-middle-block sm-height typo-body-1" style="height: 324px;">
        <div class="vertical-middle-block-cell">You haven't added any alerts yet</div>
    </div>
</script>        
<!--Add to remind-->
<div class="modal fade" data-backdrop="static" id="addWarnToggleModal">
    <div class="modal-dialog sm-width">
        <div class="modal-content">
            <div class="modal-header blackboard-mini">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Add to remind</div>
            </div>
            <div class="modal-body">               
                <div class="form-group">
                    <label class="control-label">Reminder time:</label>
                    <div>
                        <input type="text" class="form-control" readonly="readonly" style="background: #fff;" id="warnTime" placeholder="Please select reminder time" value="" />
                    </div>
                </div>
                <div class="form-group"  style="margin-top: 24px;">
                    <label class="control-label">Reminder contents:</label>
                    <div>
                        <textarea class="form-control" maxlength="60" type="text" id="warnContent" placeholder="Please enter a reminder" value="" /></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="col-xs-10 col-xs-offset-2">
                            <div class="help-block inline-help-block inline-help-block-right"></div>
                            <div class="btn-sm btn-primary btn-raised" data-value=""  id="requestAddWarn">Save</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--Message center-->
<div class="modal" data-backdrop="static" id="messageListModal">
    <div class="modal-dialog modal-confirm" >
        <div class="modal-content">
            <div class="modal-header">
                <li class="message-tab order-tab message-active" >Order messages<span class="infos"></span></li>
                <li class="message-tab warn-tab" >Reminders<span class="warninfos"></span></li>
                <li class="message-tab check-tab" >Check message<span class="checkinfos"></span></li>
                <li class="close_message">&times;</li>
            </div>            
            <div class="modal-body"> 
                <div class="message_list">
                    <div class="message-content order-content">
                        <div class="list-body" id="pushListBody"></div>
                        <div class="list-body hidden" id="nothing_pushListBody">No push message...</div>
                        <ul class="form-horizontal menu-horizontal message_list_foot">
                            <li class="all_remove">All marked as read</li>
                            <li class="tip_Info">
                                <a href="/pushNews.html?hotel={$currentHotel}">More></a>
                            </li>
                        </ul>               
                    </div>
                    <div class="message-content warn-content hidden">
                        <div class="list-body hidden" id="warnListBody"></div>
                        <div class="list-body" id="nothing_warnListBody">No warning messages...</div>
                        <ul class="form-horizontal menu-horizontal message_list_foot">
                            <li class="tip_Info">
                                <a href="/pushWarn.html">More></a>
                            </li>
                        </ul>               
                    </div>
                    <div class="message-content check-content hidden">
                        <div class="list-body" id="checkListBody"></div>
                        <div class="list-body hidden" id="nothing_checkListBody">No checked messages</div>
                        <ul class="form-horizontal menu-horizontal message_list_foot">
                            <li class="tip_Info">
                                <a href="/pushCheck.html?hotel={$currentHotel}">More></a>
                            </li>
                        </ul>               
                    </div>
                </div>                
            </div>
        </div>
    </div>
</div>
<div class="modal books-us" id="booksModal">
    <div class="modal-dialog modal-confirm" >
        <div class="modal-content">
            <div class="modal-header modal-header-member">
                <button type="button" class="btn close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div class="modal-title">Accounting</div>
            </div>
            <div class="modal-body"> 
                <div class="content-panel-project">
                    <div class="project-list active" data-value = '1'>Income</div>
                    <div class="project-list" data-value = '2'>Expenditure</div>
                </div>
                <form class="form-horizontal form-sm" id="container-books-info">
                    <div class="form-group">
                        <label class="control-label">Money</label>
                        <div class="col-xs-9">
                            <input type="text" id="booksPrice" placeholder="Please enter amount (0.00-999999.99)" class="form-control">
                        </div>
                        <div class="col-xs-2">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Date</label>
                        <div class="col-xs-9">
                            <input type="text" class="form-control"  id="booksTime" autocomplete="off"  placeholder="" value="">
                        </div>
                        <div class="col-xs-2">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Project</label>
                        <div class="col-xs-9 income-project">
                            <div class="dropdown">
                                <ul class="dropdown-menu dropdown-menu-left booksProjectTypeMenu" >
                                    <volist name="noteInCome" id="note">
                                        <if condition="$i eq 1">
                                            <li class="active" data-value="{$note.id}"><a href="javascript:void(0);">{$note.name}</a></li>
                                            <else/>
                                            <li data-value="{$note.id}"><a href="javascript:void(0);">{$note.name}</a></li>
                                        </if>
                                    </volist>
                                </ul>
                                <a data-toggle="dropdown" class="without-min-width btn text-sm booksProjectType" data-value="{$noteInCome[0]['id']}" href="javascript:void(0);"><span class="info">{$noteInCome[0]['name']}</span></a>
                            </div>  
                        </div>
                        <div class="col-xs-9 expend-project hidden">
                            <div class="dropdown">
                                <ul class="dropdown-menu dropdown-menu-left booksProjectTypeMenu" >
                                    <volist name="noteOutCome" id="note">
                                        <if condition="$i eq 1">
                                            <li class="active" data-value="{$note.id}"><a href="javascript:void(0);">{$note.name}</a></li>
                                            <else/>
                                            <li data-value="{$note.id}"><a href="javascript:void(0);">{$note.name}</a></li>
                                        </if>
                                    </volist>
                                </ul>
                                <a data-toggle="dropdown" class="without-min-width btn text-sm booksProjectType" data-value="{$noteOutCome[0]['id']}" href="javascript:void(0);"><span class="info">{$noteOutCome[0]['name']}</span></a>
                            </div>  
                        </div>
                        <div class="col-xs-2">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Payment method</label>
                        <div class="col-xs-9 booksReceiveType-us">
                            <div class="dropdown">
                                <ul class="dropdown-menu dropdown-menu-left booksReceiveTypeMenu" >
                                    <volist name="noCardhotelPayData" id="pay">
                                        <if condition="$i eq 1">
                                            <li class="active" data-value="{$pay.id}"><a href="javascript:void(0);">{$pay.name}</a></li>
                                            <else/>
                                            <li data-value="{$pay.id}"><a href="javascript:void(0);">{$pay.name}</a></li>
                                        </if>
                                    </volist>
                                </ul>
                                <a data-toggle="dropdown" id="booksReceiveType" class="without-min-width btn text-sm " data-value="{$hotelpay[0]['id']}" href="javascript:void(0);"><span class="info">{$hotelpay[0]['name']}</span></a>
                            </div>   
                        </div>
                        <div class="col-xs-2">
                            <div class="help-block"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Remark</label>
                        <div class="col-xs-9">
                            <textarea id="booksRemark"  maxlength="100" class="form-control"></textarea>
                        </div>
                        <div class="col-xs-2">
                            <div class="help-block"></div>
                        </div>
                    </div>
                </form>
                <div class="form-horizontal form-sm">
                    <div class="form-group">
                        <div class="help-block" style="height: 28px;line-height: 28px;"></div>
                        <div id="confirmBooksInfo" data-value = '1'>Save</div>
                        <div style="clear: both;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

